<template>
	<div style="padding:0px;">
		<el-form :model="dialogForm" :rules="rules" ref="dialogForm" :label-width="formLabelWidth">
		<el-card class="box-card">
		  <div slot="header" class="clearfix">
		    <span style="line-height: 30px;">订单信息</span>
		  </div>
		  <div  class="text item">
			    <el-form-item label="订单号"  >
			      <el-input  v-model="dialogForm.carOrder.orderNumber" auto-complete="off" disabled ></el-input>
			    </el-form-item>
			    <el-form-item label="汽车车型" >
			      <el-input v-model="dialogForm.carOrder.carName" auto-complete="off" disabled></el-input>
			    </el-form-item>
			    <el-form-item label="汽车数量" >
			      <el-input v-model="dialogForm.carOrder.amount" auto-complete="off" disabled></el-input>
			    </el-form-item>
			    <el-form-item label="汽车颜色" >
			      <el-input v-model="dialogForm.carOrder.color" auto-complete="off" disabled></el-input>
			    </el-form-item>
			    <el-form-item label="指导价/配置" >
			       <el-input type="textarea" v-model="dialogForm.carOrder.carConfig" auto-complete="off" disabled></el-input>
			    </el-form-item>
			</div>
		</el-card>
		
		<el-card class="box-card" style="margin-top:15px;">
		  <div slot="header" class="clearfix">
		    <span style="line-height: 30px;">验车信息</span>
		  </div>
		  <div  class="text item">
		  	<el-form-item label="验车图片"  class="is-required">
		        <qiniu  :qiniuImage="qiniuImage"  :id="qiniuImage.id" :canDelete="false" ></qiniu>
		    </el-form-item>
		    <el-form-item label="车架号"  >
		       <el-input type="textarea" v-model="dialogForm.vin" auto-complete="off" disabled></el-input>
		    </el-form-item>
		    <el-form-item label="生产年月" >
		      <el-input type="textarea" v-model="dialogForm.productionDate" auto-complete="off" disabled :maxlength="100"></el-input>
		    </el-form-item>
		  	<el-form-item label="备注信息" >
		      <el-input type="textarea" v-model="dialogForm.remark" auto-complete="off" disabled :maxlength="200"></el-input>
		    </el-form-item>
		  </div>
		</el-card>
		<el-card class="box-card" style="margin-top:15px;">
		  <div slot="header" class="clearfix">
		    <span style="line-height: 30px;">验车确认</span>
		  </div>
		  <div  class="text item">
		  	<el-form-item label="确认信息"  prop="tatus">
	    	   <el-radio-group v-model.number="dialogForm.tatus" :disabled="!dialogSendData.isAdd">
			      <el-radio :label="1">通过</el-radio>
			      <el-radio :label="0">不通过</el-radio>
			   </el-radio-group>
		    </el-form-item>
		  	<el-form-item label="确认备注"  prop="confirmRemark">
		      <el-input type="textarea" v-model="dialogForm.confirmRemark" :maxlength='200' auto-complete="off" :disabled="!dialogSendData.isAdd"></el-input>
		    </el-form-item>
		  </div>
		</el-card>
		<div style="text-align:right;margin-top:15px;">
			 <el-button @click="returnBack">返 回</el-button>
			 <el-button v-if="dialogSendData.isAdd" type="primary" @click="submitConfirmForm('dialogForm')">提 交</el-button>
		</div>
		</el-form>
	</div>
</template>
<script>
	import agentHttp from '@/utils/agentHttp.js'
    import qiniu from '@/views/qiniu/upload';
	export default{
		components:{qiniu},
		created(){		
			if(this.dialogSendData.id!==""){
	      		//修改
	      		this.selectData(); 
	      	}
        },
		props:['dialogSendData','tableData'],
		data(){
			
			return{
				formLabelWidth:'170px',
				//弹窗或者查看页面信息
		        dialogForm:{
		        	carOrder:{},
		            tatus:""
		        },
		        rules: {		
					
		        },
		        //七牛图片上传
		        qiniuImage:{
		        	id:"qiniuImage", //图片预览的id   
		        	image_uri:[]    //图片上传的列表  只含有url地址
		        }
			}
		},methods:{
			returnBack(){
				this.dialogSendData.dialogFormVisible=false;
			},
			submitConfirmForm(formName){
                this.$refs[formName].validate((valid) => {
		          if (valid) {
		          	if(this.dialogSendData.id===""){	          		
		          		
		          	}else{		
		          		this.editData();
		          	}		          	
		          } else {
		            this.$nextTick(()=>{
			          	this.$message.warning(document.getElementsByClassName('el-form-item__error')[0].innerText);
			            return false;
		            })
		          }
		        });
			},
			//初始化数据
		    selectData(){
		        agentHttp.get('adminApi/admin/car_inspection_info/view/'+this.dialogSendData.id).then((data)=>{	
		            if(data.success){
		            	this.dialogForm=data.data;
		            	this.dialogForm.carOrder.carName = this.dialogForm.carOrder.carBrand + ' ' + this.dialogForm.carOrder.carName;
		            	this.qiniuImage.image_uri = this.dialogForm.pic.split(',').notempty();//notempty去掉为空的项，不然导致图片张数控制不准
		            	this.$set(this.dialogForm,'tatus',1);

		            } 
		        }) 
		    },
		    //修改提交
		    editData(){
		        agentHttp.putJson('adminApi/admin/car_inspection_info/update',this.dialogForm).then((data)=>{
		            if(data.success){  
		            	this.$emit('refreshTableData',null);
		            	this.$message.success(data.data||"修改成功");
		            	setTimeout(()=>{
		            		this.dialogSendData.dialogFormVisible=false;
		            	},500)		            	
		            } 
		        }) 
		    }
		}
	};
	
</script>